import React, { PureComponent,Fragment } from "react";
import { connect } from "dva";
import moment from "moment";
import { Row, Col, Spin, Card, Button, Icon, message } from "antd";
import DescriptionList from '../../../components/DescriptionList';
import PtathCuring from '../../Path/Components/PtathCuring'
import styles from '../../Pbulic.less';

const { Description } = DescriptionList;


@connect(({ plan, path, global,loading }) => ({
  pathcuring:path.pathcuring,
  dictionaries: global.dictionaries,
  detaildata:plan.detaildata,
  loading:plan.loading.detailinfo,
}))
export default class DetailInfo extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { match, dispatch} = this.props;
    const detailInfoId = match.params.id && match.params.id!='detail' ? match.params.id : 0;
    detailInfoId!==0 && dispatch({
      type: "plan/fetch_plan_info",
      payload: {
        planId: detailInfoId
      }
    });
  }

  getPlanTime = (planType, startExecuteTime, stopExecuteTime) => {
    const startExecuteTimeArray=startExecuteTime ? startExecuteTime.split(",") : [];
    const stopExecuteTimeArray=stopExecuteTime ? stopExecuteTime.split(",") : [];

    switch (planType) {
      case '01':
        return `第${startExecuteTimeArray[0]}日 到 第${stopExecuteTimeArray[0]}日`;
        break;

      case '02':
        return `第${startExecuteTimeArray[0]}周的星期${startExecuteTimeArray[1]} 到 第${stopExecuteTimeArray[0]}周的星期${stopExecuteTimeArray[1]}`;
        break;

      case '03':
        return `第${startExecuteTimeArray[0]}月的第${startExecuteTimeArray[1]}日 到 第${stopExecuteTimeArray[0]}月的第${stopExecuteTimeArray[1]}日`;
        break;

      default:

        break;
    }

  }




  render() {
    const { match, detaildata, loading, dictionaries, pathcuring } = this.props;
    const detailInfoId = match.params.id;
    const planExecuteTime = dictionaries.planExecuteTime && dictionaries.planExecuteTime.length>1
      ? dictionaries.planExecuteTime.map(item=>item.label)
      :[];

    const planTypeStr = detaildata.planType && planExecuteTime[parseInt(detaildata.planType)-1];

    return (
      <Fragment>
        {loading && <div className={"globalSpin"}><Spin spinning={loading}  /></div>}
        {
          !loading && detaildata &&  detaildata.planId &&
          <Row gutter={{ md: 8, lg: 24, xl: 48 }} className={styles.small_card}>
            <Col md={8} sm={24} >
              <Card title={"计划信息"}
                    bodyStyle={{padding:24}}
              >
                <DescriptionList col={1} size="large" style={{ marginBottom: 32 }}>
                  <Description term="计划编号">{detaildata.planCode}</Description>
                  <Description term="计划名称">{detaildata.planName}</Description>
                  <Description term="计划类型">{planTypeStr}</Description>
                  <Description term="执行周期">{`每 ${detaildata.executeTime} ${planTypeStr}`}</Description>
                  <Description term="首次执行时间">{`${detaildata.startExecuteTime} 到 ${detaildata.stopExecuteTime}`}</Description>
                  <Description term="开始时间">{detaildata.beginTime && moment(detaildata.beginTime).format("YYYY-MM-DD HH:mm")}</Description>
                  <Description term="结束时间">{detaildata.endTime && moment(detaildata.endTime).format("YYYY-MM-DD HH:mm")}</Description>
                  <Description term="维保单位">{detaildata.maintenanceName}</Description>
                  <Description term="养护人">{detaildata.maintainManName}</Description>
                  <Description term="备注">{detaildata.remarks}</Description>
                  <Description term="编制人">{detaildata.creatorName}</Description>
                </DescriptionList>
              </Card>
            </Col>
            <Col md={16} sm={24} >
              <Card
                title={"计划路线"}
                bodyStyle={{padding:'1px 24px 24px 24px'}}
              >
                <PtathCuring
                  tableData={pathcuring}
                  onlyview={true}
                />
              </Card>
            </Col>
          </Row>
        }
      </Fragment>
    );
  }
}
